{% extends "view/home/inc_base.html" %}
{% block style %}
<link href="/static/assets/css/layout-question.css" rel="stylesheet" type="text/css" />
{% endblock %}
{% block content %}
{%set cate = category.id|get_cate()%}
<!--
PAGE HEADER

CLASSES:
.page-header-xs	= 20px margins
.page-header-md	= 50px margins
.page-header-lg	= 80px margins
.page-header-xlg= 130px margins
.dark			= dark page header

.shadow-before-1 	= shadow 1 header top
.shadow-after-1 	= shadow 1 header bottom
.shadow-before-2 	= shadow 2 header top
.shadow-after-2 	= shadow 2 header bottom
.shadow-before-3 	= shadow 3 header top
.shadow-after-3 	= shadow 3 header bottom
-->
<section class="page-header page-header-xs" >
    <div class="container">

        <h1>{{category.title}}</h1>

        <!-- breadcrumbs -->
        <ol class="breadcrumb">
            <li><a href="/">首页</a></li>
            {%for val in breadcrumb %}
            {% if val.id == category.id %}
            <li class="active">{{val.title}}</li>
            {% else %}
            <li><a href="{{val.url}}">{{val.title}}</a></li>

            {% endif %}
            {% endfor %}
        </ol><!-- /breadcrumbs -->
        <!-- page tabs -->

        <ul class="page-header-tabs list-inline">

            <li class="active"><a href="{{breadcrumb[0].url}}"><i class="et-target"></i> 发现</a></li>
            <!--<li class=""><a href="#"><i class="et-chat"></i> 话题</a></li>-->
            <!--<li class=""><a href="#"><i class="et-refresh"></i> 动态</a></li>-->

        </ul>

        <!-- /page tabs -->
    </div>
</section>
{%column data="column",pid=breadcrumb[0].id%}
{%if column|length >0%}
<!-- /PAGE HEADER -->
<section class="padding-bottom-0">
    <div class="container">

        <div class="row">

            {%for val in column%}
            <div class="col-md-3">

                <a class="box-icon box-icon-center box-icon-round box-icon-transparent box-icon-large box-icon-content {%if val.id == category.id %}active{%endif%}" href="{{val.url}}" style="padding-top: 35px">
                    <div class="box-icon-title">
                        {%if val.icon%}<i><img class="thumbnail rounded" src="{{val.icon|get_pic('m=0')}}" style="width: 65px;height: 65px; margin-top: -1px;margin-left: -2px"></i>{%else%}<i class="et-chat"></i>{%endif%}
                        <h4 class="nomargin">{{val.name}}</h4>
                    </div>
                    <p class="nomargin" style="height: 44px;overflow: hidden">{{val.description|truncate(30, true, "...")}}</p>
                </a>

            </div>
            {%endfor%}

        </div>


    </div>
</section>
{%endif%}
<!-- -->
<section >
    <div class="container">
        <div class="row">

            <!-- LEFT -->
            <div class="col-md-9 col-sm-9">
                <div class="panel panel-default tabs">
                    <div class="panel-heading ">
                        <ul class="nav nav-tabs ">
                            <li class="{%if order ==0%}active{%endif%}"><a href="{{cate.url}}" >最新的</a></li>
                            <li class="{%if order ==1%}active{%endif%}"><a href="{{cate.url}}-1{%if group_id%}-{{group_id}}{%endif%}" >最热的</a></li>
                            <li class="{%if order ==2%}active{%endif%}"><a href="{{cate.url}}-2{%if group_id%}-{{group_id}}{%endif%}" >推荐的</a></li>
                            <li class="{%if order ==3%}active{%endif%}"><a href="{{cate.url}}-3{%if group_id%}-{{group_id}}{%endif%}" >等待回复</a></li>
                        </ul>
                    </div>
                    {% groups data="groups",cid=category.id%}
                    {%if groups|length >0%}
                    <div class="panel-heading panel-heading-transparent" style="padding: 0px">
                        <ul class="nav nav-pills mix-filter clearfix" style="background-color: #fff;margin: 10px 15px 0px 15px">
                            <li class="filter {%if group_id==0%}active{%endif%}"><a href="{{cate.url}}">全部</a></li>
                            {%for v in groups%}
                            <li class="filter {%if group_id==v.id%}active{%endif%}"><a href="{{cate.url}}-{{order}}-{{v.id}}{%if sort%}-{{sortid}}{%endif%}{%if sorturl %}-{%endif%}{{sorturl}}">{{v.name}}</a></li>
                            {%endfor%}
                        </ul>
                    </div>
                    {%endif%}
                    <div class="panel-body" style="padding: 0 10px">
                        <div class="timeline">
                            <div class="timeline-hline"><!-- horizontal line --></div>
                            {% for val in list %}
                            {% set categoryname = val.category_id|get_cate %}
                            <!-- POST ITEM -->
                            <div class="blog-post-item blog-post-item-inverse padding-top-20 padding-bottom-20 margin-bottom-0 clearfix">
                                <div class="timeline-entry" ><!-- .rounded = entry -->
                                    <a href="#"><img src="/u/avatar/{{val.uid}}" style="width: 58px;height: 58px; margin-top: -10px"></a>
                                    <div class="timeline-vline"><!-- vertical line --></div>
                                </div>
                                <!-- IMAGE -->
                                {% if val.imgs|length==1 %}
                                <figure class="blog-item-small-image margin-bottom-0">
                                    <img class="img-responsive" src="{{val.imgs[0]}}" alt="">
                                </figure>
                                {% endif %}
                                <div class="blog-item-small-content">
                                    <h2><a href="/q/{{val.id}}" title="{{val.title}}">{{val.title}}</a></h2>
                                    <ul class="blog-post-info list-inline padding-bottom-10">
                                        <li>

                                            <a class="" href="{{categoryname.url}}">
                                                <span class="label label-light">{{categoryname.name}}</span>
                                            </a>
                                        </li>
                                        <li>{%if val.answer_users>0%}
                                            <a href="#">
                                                <span class="font-lato">{{val.answer_users|get_nickname}}</span>
                                            </a>
                                            <span class="font-lato"> 回复了问题</span>
                                            {%else%}
                                            <a href="#">
                                                <span class="font-lato">{{val.uid|get_nickname}}</span>
                                            </a>
                                            <span class="font-lato"> 发起了问题</span>
                                            {%endif%}
                                        </li>
                                        <li>
                                <span class="font-lato">
                                {{val.focus_count}} 人关注
                                    </span>
                                        </li>
                                        <li>
                                            <span class="font-lato">{{val.answer_count}} 个回复</span>

                                        </li>
                                        <li>
                                            <span class="font-lato">{{val.view}} 次浏览</span>
                                        </li>
                                        <li>
                                            <span class="font-lato"> {{val.update_time|moment}}</span>
                                        </li>

                                    </ul>
                                    {% if val.imgs|length>1 %}
                                    <div class="row margin-bottom-10">
                                        {%set i = 0%}
                                        {%for img in val.imgs%}
                                        {%if i< 4 %}
                                        <div class="col-md-3"><img class="img-responsive" src="{{img}}" alt=""></div>
                                        {%endif%}
                                        {%set i=i+1%}
                                        {%endfor%}
                                    </div>
                                    {%endif%}
                                    <p>{{val.detail|delhtmltags|truncate(90, true, "...")|safe}}</p>
                                </div>

                            </div>
                            <!-- /POST ITEM -->
                            {%endfor%}

                        </div>
                    </div>

                    <div class="panel-footer text-left padding-10">
                        <!-- Pagination Default -->
                        {{pagination | safe}}
                        <!-- /Pagination Default -->
                    </div>
                </div>
            </div>

            <!-- RIGHT -->

            <div class="col-md-3 col-sm-3">
                {% if controller.is_login %}
                <div class="alert alert-info margin-bottom-20"><!-- INFO -->
                    今天，你遇到了什么问题呢？
                    <a href="/mod/question/sys/add/?cid={{category.id}}" class="btn btn-primary btn-3d btn-block margin-top-10">提问</a>
                </div>
                {%else%}
                <div class="alert alert-info margin-bottom-20"><!-- INFO -->
                    你好! 你还没有登录，请先登录.
                    <a class="btn btn-block btn-social btn-dropbox margin-top-10  " href="/center/public/login" data-toggle="ajaxModal">
                        <i class="fa fa-sign-in"></i> 登录{{config.setup.WEB_SITE_TITLE}}
                    </a>
                </div>
                {%endif%}
                <!-- INLINE SEARCH -->
                <!--<div class="inline-search clearfix margin-bottom-20">
                    <form action="/search" method="get" class="widget_search" target="_blank">
                        <input type="search" placeholder="请输入关键词..." id="q" name="q" class="serch-input">
                        <button type="submit">
                            <i class="fa fa-search"></i>
                        </button>
                    </form>
                </div>
                &lt;!&ndash; /INLINE SEARCH &ndash;&gt;
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <a class="btn btn-primary btn-xs pull-right" href="/topic">更多</a>
                        <h2 class="panel-title">热门话题</h2>
                    </div>
                    <div class="panel-body padding-10">
                        {% keywords data ="topic",type="hot",limit="5",mod=model.id,cache="1000"%}
                        {%for k in topic%}
                        <div class="clearfix margin-bottom-10">&lt;!&ndash; discussion item &ndash;&gt;
                            {%if k.pic==0%}
                            <i class="ico-light ico-60 ico-hover et-chat pull-left margin-bottom-0 margin-top-0" ></i>
                            {%else%}
                            <img class="thumbnail pull-left" src="{{k.pic|get_pic('m=1,w=65,h=65')}}" width="60" height="60" alt="" />
                            {%endif%}
                            <h4 class=" nomargin noborder nopadding bold"><a class="tag " href="{{k.url}}">
                                <span class="txt">{{k.keyname}}</span>
                                <span class="num"><i class="fa fa-fire"></i></span>
                            </a>
                            </h4>
                            <span class="size-13 text-muted">
                                {{k.videonum}} 个主题, {{k.focus_count}} 人关注
												</span>
                        </div>&lt;!&ndash; /discussion item &ndash;&gt;
                        {%endfor%}
                    </div>
                </div>
                {%model data="data",table="question_user",order="question_count DESC",alias="a",limit="10",join='{"member": {"join": "left","as":"b","on": ["a.uid", "b.id"]}}',cache="1000"%}
                {%if data.length>0%}
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <a class="btn btn-primary btn-xs pull-right" href="#">更多</a>
                        <h2 class="panel-title">热门用户</h2>
                    </div>
                    <div class="panel-body padding-10">
                        {%for user in data%}
                        <div class="clearfix margin-bottom-10">&lt;!&ndash; squared item &ndash;&gt;
                            <img class="thumbnail pull-left rounded" src="/u/avatar/{{user.uid}}" width="40" height="40" alt="" />
                            <h4 class="size-14 nomargin noborder nopadding bold"><a href="#">{{user.username}}</a></h4>
                            <span class="size-12 text-muted">{{user.question_count}} 个问题, {{user.agree_count}} 次赞同</span>
                        </div>&lt;!&ndash; /squared item &ndash;&gt;
                        {%endfor%}
                    </div>

                </div>
                {%endif%}-->


            </div>
        </div>

    </div>
</section>
<!-- / -->
{% endblock %}

